<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html; charset=utf-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <jsp:include page="common.jsp"/>
    <!-- 引入首页的css 文件 -->
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/assets/css/login.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/index.css">
</head>
<body>
<!-- 头部 -->
<jsp:include page="header.jsp"/>
<!-- 头部 end -->
<section id="login_wrap">
    <div class="fullscreen-bg"
         style="background: url(${pageContext.request.contextPath}/assets/images/login-bg.png);height: 532px;"></div>
    <div class="login-box">
        <div class="title">
            <img height="40px" src="${pageContext.request.contextPath}/assets/images/logo.png" alt="">
            <span>欢迎登录睿道商城</span>
        </div>
        <div class="login_inner">
            <!--登录错误提示消息-->
            <div id="errorMsg" class="alert alert-danger"></div>
            <div id="loginForm" accept-charset="utf-8">
                <input type="hidden" name="action" value="login"/>
                <input id="username" name="username" type="text" placeholder="请输入账号" autocomplete="off">
                <input id="password" name="password" type="password" placeholder="请输入密码" autocomplete="off">
                <div class="verify">
                    <input id="inVerifyCode" name="check" type="text" placeholder="请输入验证码" autocomplete="off">
                    <span>
							<img id="verifyCode" src="${pageContext.request.contextPath}/captcha" width="131px"
                                 height="40px"/>
							<%--<img src="${pageContext.request.contextPath}/assets/images/verify_code.jpg" alt="">--%>
						</span>
                </div>
                <div class="submit_btn">
                    <button id="loginBtn" type="button">登录</button>
                    <div class="auto_login">
                        <input type="checkbox" name="" class="checkbox">
                        <span>自动登录</span>
                    </div>
                </div>
            </div>
            <div class="reg">没有账户？<a href="register.jsp">立即注册</a></div>
        </div>
    </div>
</section>
<!-- 底部 -->
<jsp:include page="footer.jsp"/>

<script>
    $(function () {
        $("#verifyCode").click(function (ev) {
            $("#verifyCode").attr('src', '${pageContext.request.contextPath}/captcha?time'+new Date());
        });
        $("#loginBtn").click(function () {
            var code = $("#inVerifyCode").val();
            var username=$("#username").val();
            var password=$("#password").val();
            if (code=="") {
            	$("#errorMsg").html("验证码不能为空！");
                /*alert("验证码不能为空！");*/
                return;
            }
            $.ajax({
                    type: "post",
                    url: "${pageContext.request.contextPath}/user/login",
                    dataType: "json",
                    data: {verCode: code,username:username,password:password},
                    success: function (data) {
                        console.log(data);
                        if (data.code === 0) {
                        	$("#verifyCode").attr('src','${pageContext.request.contextPath}/captcha?'+new Date());
							$("#errorMsg").html(data.info).css('display','block');
                        }else {
                        	/*alert("登录成功");*/
                            window.location.href="${pageContext.request.contextPath}/index";
						}
                    },
					error:function () {
                        alert("网络超时，请稍后重试");
					}
                });

        })
    });
</script>
</body>

</html>